import React, { useSyncExternalStore } from "react";
import { useDispatch, useSelector } from "react-redux";
import actionCreators from "./store/action.js";

const Calculator = () => {
  // mapStateToProps
  const number = useSelector((state) => state.number);
  // mapDispatchToProps
  const dispatch = useDispatch();

  return (
    <div>
      {number}
      <button onClick={() => dispatch(actionCreators.ADD())}>+</button>
      <button onClick={() => dispatch(actionCreators.MINUS())}>-</button>
    </div>
  );
};

export default Calculator;
